<template>
	<el-main>
		<el-card shadow="never">
			<el-tabs tab-position="top">

				<el-tab-pane label="微信支付">
					<el-form ref="form" label-width="100px" style="margin-top: 20px;">
						<el-form-item label="商户名称">
							<el-input v-model="wxpay.merchant_name"></el-input>
						</el-form-item>
						<el-form-item label="商户号">
							<el-input v-model="wxpay.merchant_id"></el-input>
                            <div class="el-form-item-msg" data-v-b33b3cf8="">请在微信商户后台查看</div>
						</el-form-item>
						<el-form-item label="32位商户秘钥">
							<el-input v-model="wxpay.api_key"></el-input>
							<div class="el-form-item-msg" data-v-b33b3cf8="">请在微信商户后台查看</div>
						</el-form-item>
						<el-form-item label="key证书">
                                <sc-upload-file :limit="3" :data="{otherData:'demo'}" tip="如涉及订单退款，必须上传该证书">
                                    <el-button type="default" icon="el-icon-upload">上传附件</el-button>
                                </sc-upload-file>
						</el-form-item>
						 
						<el-form-item>
							<el-button type="primary" @click="save_pay('wxpay')">保存</el-button>
						</el-form-item>
					</el-form>
				</el-tab-pane>

				<el-tab-pane label="支付宝">
					<el-form ref="form"  label-width="100px" style="margin-top: 20px;">
						 
						<el-form-item label="appKey">
							<el-input v-model="alipay.appKey"></el-input>
						</el-form-item>
						<el-form-item label="secretKey">
							<el-input v-model="alipay.secretKey"></el-input>
						</el-form-item>
						<el-form-item>
							<el-button type="primary">保存</el-button>
						</el-form-item>
					</el-form>
				</el-tab-pane>

				<el-tab-pane label="银联支付">
					<el-alert title="扩展配置为系统业务所有的配置，应该由系统管理员操作，如需用户配置应另起业务配置页面。" type="warning" style="margin-bottom: 15px;"></el-alert>
                    
					<el-button type="primary" icon="el-icon-plus" @click="table_add" style="margin-top: 20px;"></el-button>
				</el-tab-pane>

			</el-tabs>
		</el-card>
	</el-main>
</template>

<script>
	export default {
		name: 'pay',
		data() {
			return {
				wxpay: {
					merchant_name: "",
					merchant_id: "",
					api_key: "",
					cert_pem: "",
				},
				alipay: {
					open: true,
					appKey: "",
					secretKey: ""
				},
				setting: []
			}
		},
        mounted(){
            this.getPay()
        },
		methods: {
            async getPay(){
				var res = await this.$API.system.pay.list.get();
				if(res.code == 200){
                       if(res.data.wxpay!=null){
                          this.wxpay = res.data.wxpay 
                       }
                       if(res.data.alipay!=null){
                          this.alipay = res.data.alipay 
                       }

                       console.log(this.wxpay,this.alipay)
                      
				} 
			},
            async save_pay(row){
				var reqData = this.wxpay
                reqData.type = row
				var res = await this.$API.demo.setting_pay.post(reqData);
				if(res.code == 200){
					this.$message.success("保存成功")
				}else{
					this.$alert(res.message, "提示", {type: 'error'})
				}
			},
			table_add(){
				var newRow = {
					key: "",
					value: "",
					title: "",
					isSet: true
				}
				this.setting.push(newRow)
			},
			table_edit(row){
				if(row.isSet){
					row.isSet = false
				}else{
					row.isSet = true
				}
			},
			table_del(row, index){
				this.setting.splice(index, 1)
			},
		}
	}
</script>

<style>
</style>
